<a href="{{ page.root }}." class="mdl-layout__tab {% if page.id == 'index' %} is-active {% endif %}">Welcome</a>
<a href="{{ page.root }}started/index.html" class="mdl-layout__tab {% if page.id == 'started' %} is-active {% endif %}">GETTING STARTED</a>
<a href="{{ page.root }}module/ui.html" class="mdl-layout__tab {% if page.id == 'lib-ui' %} is-active {% endif %}">UI Module</a>
<a href="{{ page.root }}module/res.html" class="mdl-layout__tab {% if page.id == 'lib-res' %} is-active {% endif %}">Res Module</a>
<a href="{{ page.root }}module/kit.html" class="mdl-layout__tab {% if page.id == 'lib-kit' %} is-active {% endif %}">Kit Module</a>
<a href="{{ page.root }}module/blur.html" class="mdl-layout__tab {% if page.id == 'lib-blur' %} is-active {% endif %}">Blur Module</a>
<a href="{{ page.root }}about/index.html" class="mdl-layout__tab {% if page.id == 'about' %} is-active {% endif %}">About</a>